<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" isELIgnored="false" %>
<!DOCTYPE html>
<html>
<head>
    <%@include file="../system/head.jsp"%>
    <title>划水商城-正品-低价！</title>
    <link rel="stylesheet" type="text/css" href="/static/css/webbase.css" />
    <link rel="stylesheet" type="text/css" href="/static/css/widget-jquery.autocomplete.css" />
    <link rel="stylesheet" type="text/css" href="/static/css/pages-seckill-index.css" />
</head>

<body>
<!-- 头部栏位 -->


<script type="text/javascript" src="/static/js/plugins/jquery/jquery.min.js"></script>
<script type="text/javascript" src="/static/js/plugins/sui/sui.min.js"></script>
<script type="text/javascript" src="/static/js/widget/jquery.autocomplete.js"></script>
<script type="text/javascript" src="/static/js/widget/nav.js"></script>
<script type="text/javascript" src="/static/js/pages/seckill-index.js"></script>

<style>
    #text{
        width:200px;
        word-break:break-all;
        display:-webkit-box;
        -webkit-line-clamp:1;
        -webkit-box-orient:vertical;
        overflow:hidden;
    }
</style>
<!--页面顶部-->
<%@include file="../system/header.jsp" %>
<!--页面顶部结束-->
<div class="py-container index">
    <!--banner-->
    <div class="banner">
    </div>
    <!--商品列表-->
    <div class="goods-list">
        <ul class="seckill" id="seckill">
            <c:forEach items="${goodsByCatId}" var="goods">
            <li class="seckill-item">
                <div class="pic" onclick="location.href='${pageContext.request.contextPath}/goods/goodsDetail?goods_id=${goods.goods_id}'">
                    <img src="${goods.image1}" alt=''  >
                </div>
                <div class="intro"><span id="text" >${goods.goods_name}</span></div>
                <div class='price'><b class='sec-price'>￥${goods.goods_price}</b></div>
                <div class='num'>
                    <div>剩余<b class='owned'>${goods.goods_number}</b>件</div>
                </div>
                <a class='sui-btn btn-block btn-buy' href='${pageContext.request.contextPath}/goods/addCart?userName=${Username}&goods_id=${goods.goods_id}' target='_blank'><img style="width:8%;margin-right: 20px;margin-bottom:5px" src="https://s1.ax1x.com/2020/05/15/YrUh1s.png">加入购物车</a>
            </li>
            </c:forEach>
        </ul>
    </div>
    <%--分页开始--%>
    <div id="pager" class="pager clearfix" style="float: right"></div>
    <link rel="stylesheet" type="text/css" href="/static/css/page.css">
    <script src="/static/js/jquery.z-pager.js" type="text/javascript" charset="utf-8"></script>

    <script type="text/javascript">
        $("#pager").zPager({
            totalData: ${page.totalCount},
            current: ${page.currentPage},
            pageCount: ${page.totalPage}, //总页数
            pageData: ${page.pageSizes},
            ajaxSetData: false,
            minPage: 1,
            prevBtn: 'pg-prev', //上一页按钮
            nextBtn: 'pg-next', //下一页按钮
            btnShow: true,
        });

        function currentPage(currentPage){
            /*
                触发页码数位置： Page/js/jquery.z-pager.js 64行
            */
            console.log("当前页码数：" + currentPage);
            if(currentPage !== ${page.currentPage}){
                location.href = "${pageContext.request.contextPath}/goods/goodsList?cat_id=${cat.cat_id}&currentPage="+currentPage+""
            }

        }

    </script>
    <%--分页结束--%>
</div>
</body>
<!--回到顶部-->
<!-- 底部栏位 -->

</html>